<template>
  <view class="account-bill">
    <view class="rf-bill-list">
      <view
        class="list-item flex-start"
        v-for="(item, index) in integralList"
        :key="index"
      >
        <image mode="aspectFill" :src="item.avatarUrl"></image>
        <view class="content-time">
          <view class="text"> {{ item.nickName }} </view>
          <view class="time"> {{ item.updated_at | time }}</view>
        </view>
      </view>
    </view>
    <rf-load-more
      class="load-more"
      :status="loadingType"
      v-if="integralList.length > 0"
    ></rf-load-more>
    <rf-empty
      :bottom="bottom"
      :info="'暂无推广信息~'"
      v-if="integralList.length === 0 && !loading"
    ></rf-empty>
    <rfLoading isFullScreen :active="loading"></rfLoading>
  </view>
</template>
<script>
import { creditsLogList } from "@/api/userInfo";
import rfLoadMore from "@/components/rf-load-more/rf-load-more.vue";
import moment from "@/common/moment";
import { inviteList } from "@/api/login";
export default {
  components: {
    rfLoadMore,
  },
  data() {
    return {
      loading: true,
      integralList: [],
      headImg: this.$mAssetsPath.headImg,
      page: 1,
      loadingType: "more",
    };
  },
  computed: {
    bottom() {
      let bottom = 0;
      /*  #ifdef H5  */
      bottom = 90;
      /*  #endif */
      return bottom;
    },
  },
  filters: {
    time(val) {
      return moment(val).format("YYYY-MM-DD HH:mm:ss");
    },
    numFilter(val) {
      return val >= 0 ? `+${val.toString()}` : val;
    },
  },
  // 下拉刷新
  onPullDownRefresh() {
    this.page = 1;
    this.integralList = [];
    this.getinviteList("refresh");
  },
  // 加载更多
  onReachBottom() {
    if (this.loadingType === "nomore") return;
    this.page++;
    this.getinviteList();
  },
  onLoad(options) {
    this.initData(options);
  },
  methods: {
    // 数据初始化
    initData(options) {
      this.getinviteList();
    },
    // 获取推广列表
    async getinviteList(type) {
      const params = {};
      params.page = this.page;
      await this.$http
        .get(`${inviteList}`, {
          ...params,
        })
        .then((r) => {
          this.loading = false;
          if (type === "refresh") {
            uni.stopPullDownRefresh();
          }
          this.loadingType = r.data.data.length === 15 ? "more" : "nomore";
          this.integralList = [...this.integralList, ...r.data.data];
        })
        .catch(() => {
          this.loading = false;
          if (type === "refresh") {
            uni.stopPullDownRefresh();
          }
        });
    },
  },
};
</script>
<style scoped lang="scss">
page {
  background: #ffffff;
}
.account-bill {
  background: #ffffff;
  height: 100vh;
  .rf-bill-list {
    width: 100%;
    box-sizing: border-box;
    border-top: 1upx solid #eeeeee;
    padding: 0 20upx;
    .list-item {
      height: 128upx;
      border-bottom: 1upx solid #eeeeee;
      image {
        height: 70upx;
        width: 70upx;
        border-radius: 50%;
      }
      .content-time {
        margin-left: 20upx;
        .text {
          font-size: 28upx;
          height: 40upx;
          line-height: 40upx;
          font-weight: 500;
        }
        .time {
          font-size: u24px;
          font-weight: 400;
          color: #999999;
        }
      }
    }
  }
}
</style>
